<script setup>
</script>

<template>
  <footer class="footer-container">
    <div class="footer-center">
      <div class="footer-top">
        <div class="footer-left">
          <h3 class="footer-left-title footer-title-d">关于快看</h3>
          <p class="footer-left-description">
            快看影视皆在共同学习，为朋友提供便捷的观影体验，如果涉及到了您的权益，请联系QQ:3317822213我们将立刻下架,网站所有数据接来源于
            <a href="https://www.kanyk.net/">看一看影视网</a>
            KK影视是集当前热门影视、动漫、素材、电视剧、综艺于一身的视频综合平台，皆在为各位朋友提供最好的视频服务!在这里我们将与您一起成为最好的人!
          </p>
        </div>
        <div class="footer-right">
          <h3 class="footer-right-title footer-title-d">Luox</h3>
          <p>期待你我共同努力!!!</p>
          <!-- <p>人人都是产品经理(woshopm.com)是以产品经理,运营为核心的学习、交流、分享平台、集媒体、培训、社群为一体、全方位服务产品人和运营人，成立12年举办在线讲座1000+期。线下分享500
            +场，KK影视是集当前热门影视、动漫、素材、电视剧、综艺于一身的视频综合平台，皆在为各位网友提供最好的视频服务!在这里我们将与您一起成为最好的人!
          </p> -->
        </div>
      </div>
    </div>
    <div class="bq">
        <p>快看影视</p>
        <p class="beian">豫ICP备2022014268号-1</p>
      </div>
  </footer>
</template>

<style lang="less" scoped>
.footer-container {
  // margin-top: 20px;
  width: 100%;
  background: rgb(243 243 243 / 47%);
  .footer-center {
    margin: 0px auto;
    width: 1300px;
    max-width: 100%;
    color: #000000;
    .footer-top {
        padding-top: 20px;
      display: flex;
      .footer-title-d {
        font-size: 20px;
        color: #000000;
        font-weight: bold;
      }
      .footer-left {
        position: relative;
        width: 50%;
        padding: 20px;
        box-sizing: border-box;
        .footer-left-description {
          line-height: 28px;
          color: #000000f1;
        }
        &::after {
            content: "";
            width: 2px;
            height: 90%;
            position: absolute;
            right: 0px;
            top: 50%;
            transform: translateY(-50%);
            background: #6e6e6e26;
        }
      }
      .footer-right {
        width: 50%;
        padding: 20px;
        line-height: 28px;
        box-sizing: border-box;
      }
    }
  }
}
.bq {
  width: 100%;
  background: #000000;
        box-sizing: border-box;
        color: #fff;
        text-align: center;
        padding: 20px;

    }

@media screen and (max-width:480px){ 
  .footer-top {
    flex-direction: column;
    .footer-left {
      width: 100% !important;
    }
    .footer-right {
      width: 100% !important;
    }
  }
}

</style>